在 Vue3 當中,提供了兩個宣告響應式物件的屬性 Ref 和 Reactive ,其中 Reactive 只可以接受物件型別(包含陣列),若使用其他型別的內容會噴錯
Reactive 本身透過 proxy 來實作,會回傳一個 proxy 物件,並且由於是透過 proxy 物件操作的,因此我們的操作都是透過 proxy 來進行的,若改變 Reactive 物件會使其消失響應性
ref 基本上是用來處理基本型別的內容,但他也可以塞物件進去(基於 reactive 的轉換),那 ref 的大概概念為將內容塞到 reflmpl 物件內的 value 屬性,並且針對此 value 進行 getter 與 setter 的設定,也因為是 getter 與 setter 的設定,因此若透過 watch 來監測 ref 的物件除非透過深層搜尋,不然是監測不到深層內容更改的
當我們要使用 reactive 時非常的直覺
const obj = reactive({a: 1})
obj.a = 2;
然而我們要使用 ref 的時候需要操作他的 value
const name = ref('leo');
name.value = 'leo2'
大致上 ref 與 reactive 的使用時機其實也沒有到特別死,甚至有一派的說法是不想額外思考就全用 ref ,這招特別好用,當然,具體上還是根據需要使用到的內容來選擇會比較好,今天的內容到此結束,讓我們明天見